<template>
  <div>
    <svg
      xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink"
      width="16"
      height="16"
      viewBox="0 0 16 16"
      fill="none"
      class="one"
      :style="{width:pagesStore.sizeNum + 'px',height:pagesStore.sizeNum + 'px'}"
    >
      <g clip-path="url(#clip-path-76_3638)">
        <path
          :fill="!theme.includes('2e3c56')? '#224477' : '#fff'"
          fill-opacity="0.9"
          d="M1 3.85714L1 5.5808C1 6.05419 1.38376 6.43795 1.85714 6.43795L12.1429 6.43795C12.6162 6.43795 13 6.05419 13 5.5808L13 3.85714C13 3.38376 12.6162 3 12.1429 3L1.85714 3C1.38376 3 1 3.38376 1 3.85714ZM8.90194 5.14687C8.66562 5.14687 8.47404 4.9553 8.47404 4.71897L8.47404 4.71897C8.47404 4.48265 8.66562 4.29107 8.90194 4.29107L10.361 4.29107C10.5974 4.29107 10.7889 4.48265 10.7889 4.71897L10.7889 5.14543C10.7889 5.14623 10.7883 5.14687 10.7875 5.14687L10.7875 5.14687L8.90194 5.14687ZM1.85714 15L12.1429 15C12.6162 15 13 14.6162 13 14.1429L13 12.4192C13 11.9458 12.6162 11.5621 12.1429 11.5621L1.85714 11.5621C1.38376 11.5621 1 11.9458 1 12.4192L1 14.1429C1 14.6162 1.38376 15 1.85714 15ZM8.90194 12.8531L10.361 12.8531C10.5974 12.8531 10.7889 13.0447 10.7889 13.281L10.7889 13.281C10.7889 13.5174 10.5974 13.7089 10.361 13.7089L8.90194 13.7089C8.66562 13.7089 8.47404 13.5174 8.47404 13.281L8.47404 13.281C8.47404 13.0447 8.66562 12.8531 8.90194 12.8531ZM1.85714 10.6661L12.1429 10.6661C12.6162 10.6661 13 10.2823 13 9.80893L13 8.08393C13 7.61054 12.6162 7.22679 12.1429 7.22679L1.85714 7.22679C1.38376 7.22679 1 7.61054 1 8.08393L1 9.80893C1 10.2823 1.38376 10.6661 1.85714 10.6661ZM8.90261 8.51786L10.3604 8.51786C10.5971 8.51786 10.7889 8.70973 10.7889 8.94643L10.7889 8.94643C10.7889 9.18312 10.5971 9.375 10.3604 9.375L8.90261 9.375C8.66592 9.375 8.47404 9.18312 8.47404 8.94643L8.47404 8.94643C8.47404 8.70973 8.66592 8.51786 8.90261 8.51786Z"
        ></path>
        <circle
          cx="12.9990234375"
          cy="2.99951171875"
          r="3"
          stroke="rgba(226, 233, 251, 1)"
          stroke-width="1"
          fill="#67C23A"
        ></circle>
      </g>
      <defs>
        <clipPath id="clip-path-76_3638">
          <path d="M0 16L16 16L16 0L0 0L0 16Z" fill="white" />
        </clipPath>
      </defs>
    </svg>
  </div>
</template>

<script setup>
import useSettingsStore from "@/store/modules/settings";
import usePagesStore from '@/store/modules/pages'
const pagesStore = usePagesStore()

const settingsStore = useSettingsStore();
const topTheme = computed(() => settingsStore.topTheme);
const theme = computed(() => settingsStore.theme);
const topNav = computed(() => settingsStore.topNav);

defineProps({
  isActive: {
    type: Boolean,
    default: false,
  },
});

const emit = defineEmits();
</script>

<style scoped>
.one{
  display: inline-block;
  vertical-align: middle;
}
</style>
